<template>
	<view class="px-16">
		<z-paging ref="paging" :top-z-index='1' @query="getList" use-page-scroll v-model="list">
			<view v-for="(item,index) in list" :key='index'
				@click="$page.open('/pages/topic/topic?type=5&search_id='+item.topic_id)">
				<view class="rounded-8 mt-8 bg-white p-12 flex flex-column" v-if="item.status=='2'">
					<text class="fs-18 fw-600">{{item.content}}</text>
					<text class="fs-14 text-grey-4 mt-12">{{item.topic.topic}}</text>
				</view>

				<view class="rounded-8  mt-8 p-12 flex flex-column bg-white position-relative overflow-hidden" v-else>
					<view
						class="h-35 w-90 position-absolute bg-blue-1 item right--34 top-0 text-center flex flex-y-flex-end pb-4 box-sizing">
						<text class="text-white fs-14 pl-19">已处理</text>
					</view>
					<text class="fs-18 fw-600">{{item.content}}</text>
					<text class="fs-14 text-grey-4 mt-12">{{item.topic.topic}}</text>
				</view>
			</view>
		</z-paging>
	</view>
</template>

<script setup>
	import useZPaging from "@/uni_modules/z-paging/components/z-paging/js/hooks/useZPaging.js";
	import { ref } from 'vue';
	import { $http, $page } from '@/utils';
	import { onShareAppMessage, onLoad, onPageScroll, onReachBottom } from "@dcloudio/uni-app"
	const paging = ref()
	const list = ref([])
	useZPaging(paging)
	const getList = (page, limit) => {
		$http.get('User/feedbackList', { page: page, limit: limit }).then(res => {
			paging.value.complete(res.data)
		})
	}
</script>

<style scoped>
	.bg {
		background-color: #F4F4F4;
	}

	.item {
		transform: rotate(45deg);
	}

	.w-90 {
		width: 180rpx;
	}
</style>